來囉來囉 ~ 恭喜我們進入第五天的旅程啦 ~ 可喜可賀 ~ 恭喜發財 ~
小妹我呢,今天準備要來介紹的就是開發環境拉,是不是已經有人猜到了 (=゚ω゚)ノ
那首先,要跟大家分享的就是我所使用的開發環境,沒錯!就是 VS Code
也是第二天跟各位介紹的,還沒下載 VS Code 及套件的你,趕快回憶一下
來!傳送門也都幫你建好了,點下去就對了 ----> VS Code 安裝及前端套件介紹
什麼!有人說套件太少,不夠安裝嗎 @@???
ヽ(ˋД´)ノ
沒關係,幸虧我早有準備,要多少有多少,給 ----> VS Code 前端補充套件
終於可以了是吧,那接下來,就讓我來為各位介紹使用 Vue 所需要的開發環境了
最先登場的就是我們的 node.js 拉!「node.js」是什麼呢?
對於在前端長大的你們來說,對 JavaScript 肯定是不陌生的,而 JavaScript 是非常需要依賴瀏覽器才能執行的程式語言,導致在追求效率的同時,我們也需要寫一個網頁。
而 node.js 不同,他是可以完全獨立在我們的程式環境中,不去依賴其他伺服器,使開發者可以完全掌控整個伺服器的運作過程,也可以創造出更多的點子。
JavaScript 是能在瀏覽器的 JavaScript 引擎上執行,而 Node.js 也能在 JavaScript 的環境執行, V8 則是能在主流瀏覽器 - Google Chrome 的 JavaScript 引擎中,負責解析、執行 JavaScript ,也就去實踐 ECMAScript 規範中定義的部份。
而 Node.js 是以 V8 為核心,配合一系列 C/C++ 的套件,讓 Server 端也可以執行 JavaScript!
看到這裡,相信大家對於 node.js 已有初步的了解了呢,那接下來我們就來看看 node.js 有甚麼功能吧!
上述有跟各位介紹到,Node.js 可以執行 JavaScript 的環境,而我們所說的這個環境除了可以提供瀏覽器 Web API 能實作的 setTimeout、setInterval、console 外,也因為執行環境有差異,另可以提供一系列的 API 給開發者做使用,如:可以讀寫檔案的 fs、處理網路請求的 http、做加解密雜湊處理的 crypto、設定叢集的 cluster 等等的功能。
而在這個程式語言盛行的時代中,相信對各位來說,使用開放原始碼的套件輔助我們做開發,已經是一件在稀鬆平常不過的事情了,無論是透過套件去加速我們打 Code 的效率,或是在開發環境中加上可以輔助我們的各式工具,只要稍做設定,就能讓一個專案輕鬆加載成千上萬的外部程式,但你有想過嗎?如此方便的機制是怎麼去實現的呢?
接下來就和大家介紹這個可以幫我們實現機制的 npm 吧!
npm 的縮寫是「Node Package Manager」,而中文直翻的話就是 Node 包管理工具。
開發者也可以透過 node 所隨附的 npm cli 去進行套件的安裝及管理。例如我們在專案資料的終端機中輸入 npm install express,則會讓 npm 自動從 Registry 中尋找 express 的這個 Node.js Web Server 框架,並取得最新版本,將它下載到專案中的 node_modules 資料夾。
而在專案中,我們無法每次都能透過開發者去自行指定套件安裝,不僅不易管理,操作起來也非常沒有效率。而只需要在安裝時去 npm install,開發者就能透過專案中的 package.json 去有條理地列出我們本次的專案需要哪些套件,npm 就能自動依據其內容去輔助我們下載套件,這樣聽起來是不是非常方便好用呢 (>^ω^<)
那麼我們就來看看 npm 的重要功能吧!
在 npm 中有各式各樣的模塊,因為是讓用戶通過 npm 把自己設計的模塊放上去,導致安全及不安全的模塊混雜在其中,而在我們需要使用的時候,可以通過 npm 的指令去安裝指定的模塊,裡面都會包含一個 JSON 格式的元件,而在 node.js 的模塊中就會有內置模塊了,例如我們很常使用的 fs 與 http 的模塊!
var fs = require ("fs");
var http = require ("http");
如上方程式碼,可以直接透過 require 去導入我們的模塊,也可以使用 npm require 的第三方模塊,幫我們在內置模塊中找不到我們想要的,這時候就可以透過模塊倉庫去查詢,並下載到自己的本機,非常的方便呢!
在 npm 中我們可以透過 CLI 命令列介面去下載、卸載或更新第三方模組。
如果想知道 npm CLI 是否有安裝成功,可以輸入指令 npm - v
去確認,如下圖就是有成功安裝呦!
如圖我們可以得知我所安裝的版本是 8.1.0。
當然,要安裝 npm 其實一點都不難喔!我們只需要安裝 Node.js,npm 就會跟著 node 這隻程式一起被安裝進去,因為 npm 本身就是基於 JavaScript 被開發出來的,而開發的目的當然就是想讓使用者更加方便的去管理並發布套件拉!
而我們如果到 npm 的官方可以看到 express 的下載量是非常驚人的
下一篇將會教大家如何下載 node.js ,成功安裝後將會帶大家實際安裝看看 express 喔!
好拉,那我們今天對於 node.js 與 npm 的介紹就到這邊結束啦。
明天就會與各位一起進入安裝/驗證及小小的實作呦,再請各位敬請期待!謝謝大家 <3